@value unit, font, font-size, line-height, line-color, dark-gray-color from  "../global/global.css";
@value baselineCorrection: 6px;

.markdown {
  composes: font;

  font-size: font-size;
  line-height: line-height;

  & p,
  & blockquote,
  & ul,
  & ol,
  & pre {
    margin: 0;

    &:not(:last-child) {
      margin-bottom: line-height;
    }
  }

  & li:not(:last-child) {
    & > p,
    & > blockquote,
    & > ul,
    & > ol,
    & > pre {
      margin-bottom: line-height;
    }
  }

  & hr {
    margin: calc(0 - baselineCorrection) 0 calc(baselineCorrection - 1px);

    border: none;
    border-bottom: 1px solid line-color;
  }

  & blockquote {
    padding: 0 0 0 calc(2 * unit);

    color: dark-gray-color;
    box-shadow: inset 2px 0 0 line-color;

    font-size: 12px;
    line-height: 18px;
  }

  & ul,
  & ol {
    padding: 0 0 0 calc(4 * unit);
  }

  & ul {
    list-style-type: none;

    & > li {
      position: relative;

      &::before {
        position: absolute;
        left: calc(-2 * unit);

        content: '—';
      }
    }
  }
}
